define.template({
    type: 'View',
    node: {
        type: 'Tabs',
        position: 'left',
        nodes: [
            {
                text: 'View',
                target: {
                    type: 'View',
                    id: 'layout_view',
                    node: {
                        type: 'Html',
                        text: '这是View下的Html'
                    }
                }
            },
            {
                text: 'Section',
                target: {
                    type: 'Section',
                    id: 'layout_section',
                    node: {
                        type: 'Html',
                        text: '这是Section下的Html'
                    }
                }
            },
            {
                text: 'Vertical',
                target: {
                    type: 'Vertical',
                    nodes: [
                        {type: 'Html', text: '这是第1个子组件,高度为默认', style: 'background:red;'},
                        {type: 'Html', text: '这是第2个子组件,高度为-1', height: -1, style: 'background:green;'},
                        {type: 'Html', text: '这是第3个子组件,高度为*', height: '*', style: 'background:blue;'},
                        {type: 'Html', text: '这是第4个子组件,高度为200', height: 200, style: 'background:yellow;'},
                        {type: 'Html', text: '这是第5个子组件,高度为*', height: '*', style: 'background:blue;'}
                    ]
                }
            },
            {
                text: 'Horizontal',
                target: {
                    type: 'Horizontal',
                    nodes: [
                        {type: 'Html', text: '这是第1个子组件,宽度为默认', style: 'background:red;'},
                        {type: 'Html', text: '这是第2个子组件,宽度为-1', width: -1, style: 'background:green;'},
                        {type: 'Html', text: '这是第3个子组件,宽度为*', width: '*', style: 'background:blue;'},
                        {type: 'Html', text: '这是第4个子组件,宽度为200', width: 200, style: 'background:yellow;'},
                        {type: 'Html', text: '这是第5个子组件,宽度为*', width: '*', style: 'background:blue;'}
                    ]
                }
            },
            {
                text: 'Frame',
                target: {
                    type: 'Vertical',
                    nodes: [
                        {
                            type: 'ButtonBar', nodes: [
                                {text: '显示1', on: {click: 'VM(this).find("layout_frame").focus("frame_html1");'}},
                                {text: '显示2', on: {click: 'VM(this).find("layout_frame").focus("frame_html2");'}},
                                {text: '显示3', on: {click: 'VM(this).find("layout_frame").focus("frame_html3");'}}
                            ]
                        },
                        {
                            type: 'Frame',
                            id: 'layout_frame',
                            dft: 'frame_html2',
                            nodes: [
                                {type: 'Html', id: 'frame_html1', text: '这是第1个子页面'},
                                {type: 'Html', id: 'frame_html2', text: '这是第2个子页面'},
                                {type: 'Html', id: 'frame_html3', text: '这是第3个子页面'}
                            ]
                        }
                    ]
                }
            },
            {
                text: 'Table',
                target: {
                    type: 'Table',
                    columns: [
                        {type: 'Column', field: 'A', width: 40, format: 'javascript:return {type:"TableRowNum"}'},
                        {
                            field: 'AA',
                            width: 40,
                            format: 'javascript:return {type:"TableTripleBox", name:"selectItem"}'
                        },
                        {field: 'B', width: 200},
                        {field: 'C', width: '*'},
                        {
                            field: 'D',
                            width: 90,
                            format: '<a href="javascript:;" onclick="$.alert($A);">查看</a>&nbsp;&nbsp;<a href="javascript:;" onclick="$.widget(this).closest(\'TR\').remove();">删除</a>'
                        }
                    ],
                    tHead: {
                        nodes: [
                            {
                                type: 'TR', data: {
                                    A: '序号',
                                    AA: {type: 'TripleBox', name: 'selectItem', checkAll: true},
                                    B: '姓名',
                                    C: '班级',
                                    D: '操作'
                                }
                            }
                        ]
                    },
                    tBody: {
                        nodes: [
                            {A: 1, B: '张三', C: '一班', D: '查看'},
                            {A: 2, B: '李四', C: '二班', D: '查看'},
                            {A: 3, B: '王五', C: '三班', D: '查看'},
                            {A: 5, B: '赵六', C: '一班', D: '查看'}
                        ]
                    }
                }
            },
            {
                text: 'Form',
                target: {
                    type: 'Form',
                    pub: {colSpan: 4},
                    nodes: [
                        {type: 'Text', label: {text: '姓名'}, value: '张三'},
                        {
                            type: 'RadioGroup', label: {text: '性别'}, nodes: [
                                {value: '1', text: '男', checked: true},
                                {value: '2', text: '女'}
                            ]
                        },
                        {
                            colSpan: 6,
                            node: {
                                type: 'DropBox', label: {text: '民族'}, value: '02',
                                nodes: [
                                    {value: '01', text: '汉族'},
                                    {value: '02', text: '满族'},
                                    {value: '03', text: '回族'}
                                ]
                            }
                        },
                        {
                            colSpan: 6,
                            node: {type: 'DatePicker', label: {text: '生日'}, value: '1970-01-01'}
                        },
                        {
                            type: 'TD',
                            colSpan: -1,
                            node: {type: 'Textarea', label: {text: '简介'}, value: '不告诉你222'}
                        }
                    ]
                }
            },
            {
                text: 'Tabs',
                target: {
                    type: 'Tabs',
                    position: 'bottom',
                    nodes: [
                        {
                            type: 'Tab', text: '第1个标签', target: {
                                type: 'Html',
                                text: '第1个标签内容'
                            }
                        },
                        {
                            text: '第2个标签', focus: true, target: {
                                type: 'Html',
                                text: '第2个标签内容'
                            }
                        },
                        {
                            text: '第3个标签', target: {
                                type: 'Html',
                                text: '第3个标签内容'
                            }
                        }
                    ]
                }
            },
            {
                text: 'Collapse',
                target: {
                    type: 'Collapse',
                    focusMultiple: true,
                    nodes: [
                        {
                            text: '第1个标签', target: {
                                type: 'Html',
                                text: '第1个标签内容'
                            }
                        },
                        {
                            text: '第2个标签', focus: true, target: {
                                type: 'Html',
                                text: '第2个标签内容'
                            }
                        },
                        {
                            text: '第3个标签', target: {
                                type: 'Html',
                                text: '第3个标签内容'
                            }
                        }
                    ]
                }
            },
            {
                text: 'FieldSet',
                target: {
                    type: 'FieldSet',
                    box: {type: 'Radio', value: '1', text: '手动设置文本'},
                    legend: 'legend文本',
                    nodes: [
                        {type: 'Text', label: {text: 'IP地址'}},
                        {type: 'Text', label: {text: '子网掩码'}},
                        {type: 'Text', label: {text: '默认网关'}}
                    ]
                }
            }
        ]
    }
});